<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<base href="<%=basePath%>">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>驴友社交-登陆</title>
<link href="CSS/reg.css" rel="stylesheet" type="text/css" />
<link href="CSS/footer.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="js/jquery-1.4.2.min.js"></script>
<script src="js/UrlParam.js" type="text/javascript"></script>
<script src="js/GA_Statistics.js" type="text/javascript"></script>
<script src="js/Check.js" type="text/javascript"></script>
<script type="text/javascript">

        $(function () {

            $("#userLogin").removeClass().addClass("z_li_j_e");

            var param = new Object();

            param = GetUrlParms();

            var username = $("#AccountInput").val();

            var pass = $("#Password").val();

            if (param["key"] != "" && param["key"] != null && param["key"] != "") {

                $("#CodeError").show();

                $("#AccountInputShow").hide();

                $("#AccountInputOk").removeClass().addClass("z_right_li_c").css({ display: "none" });

                $("#UserPassShow").hide();

                $("#UserPassOk").removeClass().addClass("z_right_li_c").css({ display: "none" });

                $("#CodeMsg").html("用户名或密码输入错误");

            }

        });

        var checkUserName = false;

        var checkUserPass = false;

        var validate = {

            UserNameOnfocus: function () {

                $("#AccountInputMsg").html("");

                $("#AccountInputShow").show();

                $("#AccountInputOk").removeClass().addClass("z_right_li_c").css({ display: "none" });

                $("#AccountInputError").hide();

            },

            UserNameOnblur: function () {

                $("#AccountInputMsg").html("");

                $("#AccountInputShow").hide();

                var userName = $("#AccountInput").val();

                var regEmail = /^([0-9a-z][0-9a-z_]*[0-9a-z]|[0-9a-z])@[a-z0-9.-]+\.[a-z]{2,4}$/i;

                var regPhone = /^(13\d{9})|(15\d{9})|(18\d{9})|(147\d{8})$/;

                var regPhoneNum = /^\d{11}$/;

                if (userName.length > 30 || userName.length < 1) {

                    $("#AccountInputError").show();

                    $("#AccountInputMsg").html("请输入正确的登录账号");

                }

                else {

                    if (userName.indexOf("@") != -1) {

                        if (!regEmail.test(userName)) {

                            $("#AccountInputError").show();

                            $("#AccountInputMsg").html("请输入正确的邮箱地址");

                            return;

                        }

                        checkUserName = true;

                        $("#AccountInputOk").show();

                    }

                    else {

                        if (regPhoneNum.test(userName) && !regPhone.test(userName)) {

                            $("#AccountInputError").show();

                            $("#AccountInputMsg").html("请输入正确的手机号码");

                            return;

                        }

                        checkUserName = true;

                        $("#AccountInputOk").show();

                    }

                }

            },

            UserPassOnfocus: function () {

                $("#UserPassMsg").html("");

                $("#UserPassShow").show();

                $("#UserPassOk").removeClass().addClass("z_right_li_c").css({ display: "none" });

                $("#UserPassError").hide();

            },

            UserPassOnblur: function () {

                $("#UserPassMsg").html("");

                $("#UserPassShow").hide();

                var pass = $("#Password").val();

                if (pass == "") {

                    $("#UserPassError").show();

                    $("#UserPassMsg").html("请输入您的登录密码");

                    return;

                }

                $("#UserPassOk").show();

                checkUserPass = true;

            }

        };

        function Submit() {

            if (!checkUserName || !checkUserPass || !subUserCode) {

                validate.UserNameOnblur();

                validate.UserPassOnblur();

                Checked.UserCodeOnblur();

                return;

            }

            document.forms[0].action = "CheckLogin.html?key=checklogin";

            document.forms[0].submit();

        }

    </script>
</head>

<body>
  <div class="content">
      <div class="z_main">
          <div class="z_left">
             <div class="z_logo">
                   <a href="javascript:void(0)"><img src="images/z_logo.png" border="0" /></a></div>
             <div class="z_li">
              <a href="Index.html" id="index" class="z_li_a"></a>
              <a href="Register.html" id="register" class="z_li_b"></a>
              <a href="Login.html" id="login" class="z_li_c"></a>
              <a href="ForgetPassword.html" id="forgetpass" class="z_li_d"></a>
             </div>
          </div> 
          <div class="z_right">
                <div class="z_right_li">

                    <div class="z_right_li_a">

                        登录账号:</div>

                    <input type="text" name="AccountInput" id="AccountInput" class="z_right_li_b" onfocus="validate.UserNameOnfocus();"

                        onblur="validate.UserNameOnblur();" value="" />

                    <div id="AccountInputShow" class="z_tishi" style="display: block">

                        请输入邮箱或手机号</div>

                    <div id="AccountInputOk" class="z_right_li_c" style="display: none">

                    </div>

                    <div id="AccountInputError" style="position: relative; display: none;">

                        <div class="z_right_wrong">

                        </div>

                        <div id="AccountInputMsg" class="z_wrong">

                        </div>

                    </div>

                </div>

                <div class="z_right_li" style="height: 25px;">

                </div>

                <div class="z_right_li">

                    <div class="z_right_li_a">

                        登录密码:</div>

                    <input name="Password" type="password" id="Password" class="z_right_li_b" onfocus="validate.UserPassOnfocus();"

                        onblur="validate.UserPassOnblur();" />

                    <div id="UserPassShow" class="z_tishi" style="display: block">

                        密码注意区分大小写！</div>

                    <div id="UserPassOk" class="z_right_li_c" style="display: none;">

                    </div>

                    <div id="UserPassError" style="position: relative; display: none;">

                        <div class="z_right_wrong">

                        </div>

                        <div id="UserPassMsg" class="z_wrong">

                        </div>

                    </div>

                </div>

                <div class="z_right_li" style="height: 25px;">

                </div>

                <div class="z_right_li">

                    <div class="z_right_li_a">

                        验证码:</div>

                    <input type="text" id="AuthCodeInput" name="AuthCodeInput" class="z_yanzheng" maxlength="4"

                        onfocus="Checked.UserCodeOnfocus();" onblur="Checked.UserCodeOnblur();" />

                    <div style="float: left;">

                        <img src="/CheckCode/Index" id="AuthCodeImage" width="62" height="28" hspace="0"

                            vspace="0" border="0" id="ctl00_Body_AuthCodeImage" />

                        <a href="javascript:document.getElementById('AuthCodeImage').src='/CheckCode/Index?d='+new Date().getTime();void(0);"

                            style="font-size: 12px; margin-left: 0px;">换一张</a></div>

                    <div style="float: left; width: 50%;">

                        <div id="CodeOk" class="z_right_li_c" style="display: none;">

                        </div>

                        <div id="CodeError" style="position: relative; display: none;">

                            <div class="z_right_wrong">

                            </div>

                            <div id="CodeMsg" class="z_wrong">

                            </div>

                        </div>

                    </div>

                </div>

                <div class="z_right_li" style="height: 24px;">

                </div>

                <div class="z_right_li">

                    <div class="t_icton_a">

                        <a href="javascript:Submit();">登&nbsp;&nbsp;录</a></div>

                    <div class="z_wji">

                        <a href="ForgetPassword.html">忘记密码</a></div>

                </div>
            </div>
          </div>
      </div>       
  </div>
  <div class="footer">

    <center class="footerNav">

        <a href="/About.html" target="_blank">关于我们</a>| <a href="/FLink.html" target="_blank">

            友情链接</a>| <a href="/ContactUs.html" target="_blank">联系我们</a>| <a href="/Help.html"

                target="_blank">帮助中心</a>| <a href="/UserMessage.html" target="_blank">用户留言</a>

    </center>

    <center>

        版权所有北京交通大学软件学院 fine girls项目小组</center>

    <center>

        Copyright&copy; 2008-2012 Reunion Infotech co. ltd All rights reserved.</center>

</div>
</body>
</html>
